<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<script src="./js/jquery-1.7.2.min.js"></script>
</head>
<style>
</style>
<script>

$(document).ready(function () {

var now = new Date();
	$("#date").text(now.getFullYear()+"-"+(now.getMonth()+1)+"-"+now.getDate() + "  "+now.getHours()+":"+now.getMinutes()+":"+now.getSeconds());

	$("#printTest").click(function(){
		printTest();
	});
	
	$("#generate").click(function(){
		
		var options = {
			total:$("#total").val()
			,innerTwenty:$("#innerTwenty:checked").val()
			,innerFifty:$("#innerFifty:checked").val()
			,innerHundred:$("#innerHundred:checked").val()
			,one10Multi:$("#one10Multi:checked").val()
			,inner20Multi:$("#inner20Multi:checked").val()
			
		}
		
		options.totalCount = 0;
		options.numberList = [];
		options.nameList = [];
		$(".item:checked").each(function(i,n){
			options.totalCount += $(n).val() * 100;
			options.numberList.push(options.totalCount);
			options.nameList.push($(n).attr("attr"));
		});
		
		
		var testList = generatTest(options);
		
		$("#testList").empty();
		
		for(var i = 0 ; i<testList.length ; i++){
			showTest(testList[i]);
		}
	});
});

function generatTest(options){
		
		if(options.nameList.length<=0){
			alert("至少选择一个题目类别");
			return;
		}
		var result = [];
		var sumCount = options.total;
		
		while(sumCount >0 ){
			var random = Math.round(Math.random() * (options.totalCount-1));
			var number = 0;
			for(var i = options.numberList.length ; i >= 0;i--){
				if(random >= options.numberList[i-1])
				{
					number = i;
					break;
				}
			}
			var targetScript = options.nameList[number]+"();";
			var item = eval(targetScript);
			
			
			if(!isExist(result , item)){
				result.push(item);
				sumCount --;	
			}
		}

		return result;
		
	}

function isExist(result , testItem){
	for(var i = 0;i<result.length;i++){
		if(result[i] == testItem){
		console.log(testItem);
			return true;
		}
	}
	return false;
}

function showTest(testItem){
	
	var testTable = $("<table></table>").addClass("testItem");
	var tr = $("<tr></tr>");
	tr.append($("<td></td>"));
	tr.append($("<td></td>").attr("align","right").addClass("fontClass").text(testItem.left));
	testTable.append(tr);
	var tr2 = $("<tr></tr>");
	tr2.append($("<td></td>").attr("align" , "left").addClass("fontClass").text(testItem.flag));
	tr2.append($("<td></td>").attr("align" , "right").addClass("fontClass").text(testItem.right));
	testTable.append(tr2);
	var tr3 = $("<tr></tr>");
	tr3.append($("<td></td>").attr("colspan" , 2).append($("<div></div>").addClass("line")));
	testTable.append(tr3);
	$("#testList").append(testTable);
	
}

function printTest(){
  window.print(); 
}

//有进位的加法
function tenPlus(){
	var one,two;
	two = 1+Math.round(Math.random() * 8);
	one = 10 + Math.round(Math.random() * (two-1));
	return {
	left:one,flag:"+",right:two
	}
}

//有退位的减法
function tenMinus(){
	var one,two;
	two = 1+Math.round(Math.random() * 8);
	one = 10 + Math.round(Math.random() * (two-1));
	return {
	left:one,flag:"-",right:two
	}
}
//20以内加减法
function innerTwenty(){
	var flag = Math.round(Math.random() * 1000);
	var one , two , flagStr;
	if(flag % 2 == 0){
		//加法
		flagStr = "+";
		two = 1+Math.round(Math.random() * 8);
		one = 1+Math.round(Math.random() * 8);
		
	}else{
		flagStr = "-";
		var number1 = 1+Math.round(Math.random() * 8);
		var number2 = 10+Math.round(Math.random() * 9);
		one = number1>number2?number1:number2;
		two = number1<number2?number1:number2;
	}
	return {
	left:one,flag:flagStr,right:two
	}
}

function innerFifty(){
	var flag = 1+Math.round(Math.random());
	var one , two , flagStr;
	if(flag>1){
		//加法
		flagStr = "+";
		two = 10+Math.round(Math.random() * 40);
		one = 10+Math.round(Math.random() * 40);
		
	}else{
		flagStr = "-";
		var number1 = 10+Math.round(Math.random() * 40);
		var number2 = 10+Math.round(Math.random() * 40);
		one = number1>number2?number1:number2;
		two = number1<number2?number1:number2;
	}
	return {
	left:one,flag:flagStr,right:two
	}
}

function innerHundred(){
	var flag = 1+Math.round(Math.random());
	var one , two , flagStr;
	if(flag>1){
		//加法
		flagStr = "+";
		two = 10+Math.round(Math.random() * 90);
		one = 10+Math.round(Math.random() * 90);
		
	}else{
		flagStr = "-";
		var number1 = 10+Math.round(Math.random() * 90);
		var number2 = 10+Math.round(Math.random() * 90);
		one = number1>number2?number1:number2;
		two = number1<number2?number1:number2;
	}
	return {
	left:one,flag:flagStr,right:two
	}
}

function inner20Multi(){
	var flagStr = "X";
	var one , two , flagStr;
	
	two = 10+Math.round(Math.random() * 10);
	one = 10+Math.round(Math.random() * 10);
		
	return {
	left:one,flag:flagStr,right:two
	}
}

function one10Multi(){
	var flagStr = "X";
	var one , two , flagStr;
	
	two = 1+Math.round(Math.random() * 8);
	one = 9+Math.round(Math.random() * 10);
		
	return {
	left:one,flag:flagStr,right:two
	}
}
</script>

<style>

.fontClass{
	font-size : 20px;
	font-weight : blod;
	letter-spacing : 8px;
}

.configItem{
	display:inline;
	float:left;
	margin-right:10px
}

.testItem{
	float:left;
	
	margin-left:30px;
	margin-bottom:50px;
	width:80px;
}

div.row{
margin-top:30px;
}

div.line{
height:5px;
/* background-image:url('./line.png');*/
border-top:2px solid black;
width:100%;
}
</style>

<body>
	<div>
		<div class="configItem">竖式总题目<input id="total" type="input" maxLength="3" value="48"></div>
		<div class="configItem"><input id="innerTwenty" class="item" attr="innerTwenty"  type="checkbox" value="10"/>20以内加减法</div>
		<div class="configItem"><input id="innerFifty" class="item" attr="innerFifty" checked type="checkbox" value="20"/>50以内加减法</div>
		<div class="configItem"><input id="innerHundred" class="item" attr="innerHundred"  type="checkbox" value="10"/>100以内加减法</div>
		
		<div class="configItem"><input id="innerHundred" class="item" attr="one10Multi"  type="checkbox" value="10"/>单10乘法</div>
		<div class="configItem"><input id="innerHundred" class="item" attr="inner20Multi"  type="checkbox" value="10"/>20以内乘法</div>
	</div>
	<div>
		<input type="button" id="generate" value="生成">
		<input type="button" id="printTest" value="打印">
		<span id="date"></span>
	</div>
	
	<!--startprint-->
	<div id="testList">
		
	</div>
	<!--endprint-->
</body>